<template>
	<view>
		<xy-list v-model="orderSkuIds">
		    <xy-list-item
		        type="media"
				selectType="checkbox"
		        :title="item.title + ''"
		        :key="index"
		        :value="item.id + ''"
				:image="item.cover"
		        :checked="orderSkuIds.indexOf(item.id) >= 0 ? true: false "
		        v-for="(item,index) in orderSkuList"
		        titleFs="14px">
				<template slot="info">
					<view class="left text-gray">
						<view class="des m-t-xs" style="margin-left: -10px;">
							<xy-tag type="gray" size="middle" class="font-xs bg-gray">
								{{item.spec}}
							</xy-tag>
						</view>
						<view class="price text-error">
							<view class="font-md">
								¥<text class="">&nbsp;&nbsp;{{item.price}}</text>
								<text class="m-l-sm text-gray font-sm"></text>
							</view>
						</view>
					</view>
					<view class="right p-t-xs font-sm text-gray">
						<text>x{{item.amount}}</text>
					</view>
				</template>
		    </xy-list-item>
		</xy-list>
		<view class="extra m-t">
			<xy-list-item
				type="input"
				title="获取状态"
				titleFs="14px">
				<template slot="titleRight">
					<xy-picker v-model="type" :options="deliverStateList"></xy-picker>
				</template>
			</xy-list-item>
			<xy-list-item
				type="input"
				title="退货方式"
				titleFs="14px">
				<template slot="titleRight">
					<xy-picker v-model="deliverState" :options="typeList"></xy-picker>
				</template>
			</xy-list-item>
			<xy-list-item
				type="input"
				title="退货原因"
				titleFs="14px">
				<template slot="titleRight">
					<xy-picker v-model="reasonId" :options="reasonList"></xy-picker>
				</template>
			</xy-list-item>
			<xy-list-item
				type="input"
				title="退货金额"
				:current="'最多退' + maxMoney + '元'"
				titleFs="14px">
				<template slot="titleRight">
					<input type="text" v-model="money" placeholder="请输入退款金额"/>
				</template>
			</xy-list-item>
		</view>
		<button class="m-l m-r m-t" @click="submit" type="primary">提交申请</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderNo: '',
				orderSkuList: [],
				orderSkuIds: [],
				deliverState: 0,
				type: 0,
				reasonId: 0,
				money: 0,
				deliverStateList: [
					{
						title: '已收到货',
						value: '1',
					},
					{
						title: '未收到货',
						value: '2',
					},
				],
				typeList: [
					{
						title: '退货退款',
						value: '1',
					},
					{
						title: '仅退款',
						value: '2',
					},
					{
						title: '仅退货',
						value: '3',
					}
				],
				reasonList: [
					{
						title: '多拍/错拍/',
						value: '1',
					}
				]
			};
		},
		async onLoad(options) {
			this.orderNo = options.orderNo;
			await this.loadData();
		},
		computed: {
			maxMoney: function(){
				let maxMoney = 0;
				for (let item of this.orderSkuList) {
					for (let item1 of this.orderSkuId) {
						if (item1 == item.id) {
							maxMoney = (maxMoney * 100 + item.realMoney * 100)/100;
						}
					}
				}
				return maxMoney;
			}
		},
		methods: {
			async loadData() {
				uni.showLoading({
					title: '加载中...'
				});
				// 获取数据
				let res = await this.util.request({
					url: '/v1/ishop/order_return/apply',
					method: 'get',
					data: {
						orderNo: this.orderNo
					}
				});
				if (res.code == 200) {
					this.orderSkuList = res.data.dataList;
					this.reasonList = res.data.reasonList;
					console.log(this.orderSkuList)
				} else {
					uni.showModal({
						content: res.msg,
						success: async (e)=>{
							uni.navigateBack();
						}
					});
				}
				uni.hideLoading();
			},
			async submit() {
				if (this.orderSkuIds.length == 0) {
					uni.showToast({
						icon: 'loading',
						title: '请选择退款商品'
					});
					return;
				}
				let res = await this.util.request({
					url: '/v1/ishop/order_return/apply',
					method: 'post',
					data: {
						orderNo: this.orderNo,
						orderSkuIds: this.orderSkuIds,
						deliverState: this.deliverState,
						type: this.type,
						reasonId: this.reasonId,
						money: this.money
					}
				});
				if (res.code == 200) {
					this.orderSkuList = res.data.dataList;
					console.log(this.orderSkuList)
					uni.navigateTo({
						url: '../order/my'
					})
				} else {
					uni.showModal({
						content: res.msg,
						success: async (e)=>{
						}
					});
				}
			}
		}
	}
</script>

<style lang="scss">
	.extra {
		/deep/ .xy-list-item {
			.left {
				margin-right: 40px;
			}
		}
	}
</style>
